<template>
    <div style="min-width:809px">
        <div v-if="$route.path == '/agreement'">
            <el-tabs type="border-card" v-loading="loading">
                <el-tab-pane label="隐私协议">
                    <div class="title">隐私协议</div>
                    <quill-editor
                        v-model="privacy_agreement"
                        :options="editorOptions"
                    />
                </el-tab-pane>
                <el-tab-pane label="用户注册协议">
                     <div class="title">用户注册协议</div>
                    <quill-editor
                        v-model="user_agreement"
                        :options="editorOptions"
                    />
                </el-tab-pane>
                <el-tab-pane label="购卡协议">
                    <div class="title">购卡协议</div>
                    <quill-editor
                        v-model="vip_agreement"
                        :options="editorOptions"
                    />
                </el-tab-pane>
                <el-button class="btn" type="primary" @click="submit">保存</el-button>
            </el-tabs>
        </div>
        <router-view></router-view>
       
    </div>
</template>

<script>
export default {
    data() {
        return {
            recordList:[],
            loading: false,
            tableData: [],
            privacy_agreement: '',
            user_agreement: '',
            vip_agreement: '',
            editorOptions: {
                modules: {
                toolbar: [
                    ['bold', 'italic', 'underline'],
                    [{ 'header': [1, 2, 3, false] }],
                    [{ 'color': [] }, { 'background': [] }],
                    ['link', 'image']
                ]
                },
                placeholder: '请输入内容...',
                theme: 'snow'
            }
        };
    },
    created() {
       this.getList()
    },
    methods: {
        async submit(){
            console.log(222, this.privacy_agreement, this.user_agreement)
            this.loading = true;
            let { code, data } = await this.$Http.setAgreement({
                user_agreement: this.user_agreement,
                privacy_agreement:  this.privacy_agreement,
                vip_agreement: this.vip_agreement
            });
            this.loading = false;
            if (code) {
                this.$message.success('保存成功');
                this.getList()
            }
        },
        async getList() {
            this.loading = true;
            let { code, data } = await this.$Http.getAgreement();
            this.loading = false;
            if (code) {
                this.privacy_agreement = data.privacy_agreement
                this.user_agreement = data.user_agreement
                this.vip_agreement = data.vip_agreement
            }
        },
    },
};
</script>

<style lang="scss" scoped>
.image-thumbnail {
    width: 130px;
    height: 130px;
}
.title{margin: 20px 0;
    font-weight: bold;
    font-size: 30px;
}
.btn{
    margin-top: 30px;
}
</style>